<style>
	.xd {
		padding: 0 20px;
		padding-top: 30px;
	}

	.xd .server_config {
		border: 1px solid #ccc;
	}

	.config_header {
		height: 50px;
		line-height: 50px;
		border-bottom: 1px solid #ccc;
		background-color: rgba(243, 243, 243, 1)
	}

	.config_title {
		font-size: 20px;
		padding-left: 20px;
	}

	.config_operate {
		padding-right: 20px;
	}

	.config_form {
		margin-top: 20px;
	}
</style>
<div class="xd">
	<div class="server_config">
		<div class="config_header clearfix">
			<div class="pull-left config_title">
				邮件服务
			</div>
			<div class="pull-right config_operate">
				<button type="button" class="btn btn-primary btn-sm" id="emailTest">测试</button>
				<button type="button" class="btn btn-info btn-sm" id="emailSave">保存</button>
				<button type="button" class="btn btn-info btn-sm" id="reset">重置</button>
			</div>
		</div>
		<div class="config_form clearfix xd-template">
			<form class="form-horizontal xs-form" id="form_1">
				<div class="form-group col-lg-6">
					<label class="col-lg-4 control-label">email服务器地址</label>
					<div class="col-lg-6">
						<input type="text" class="form-control input-sm" reg="notempty" id="host" maxlength="50">
					</div>
				</div>
				<div class="form-group col-lg-6" style="height:30px;">

				</div>
				<div class="form-group col-lg-6">
					<label class="col-lg-4 control-label">发件邮件地址</label>
					<div class="col-lg-6">
						<input type="text" class="form-control input-sm" reg="notempty,email" id="username" maxlength="50">
					</div>
				</div>

				<div class="form-group col-lg-6">
					<label class="col-lg-4 control-label">发件邮箱密码</label>
					<div class="col-lg-6">
						<input type="password" class="form-control input-sm" reg="notempty,password" id="epass" maxlength="50">
					</div>
				</div>

				<div class="form-group col-lg-6">
					<label class="col-lg-4 control-label">测试邮件地址</label>
					<div class="col-lg-6">
						<input type="text" class="form-control input-sm" reg="email" id="testAddress" maxlength="50">
					</div>
				</div>
				<div class="form-group col-lg-6" style="height:30px;">
					<label class="col-lg-4 control-label">是否使用ssl</label>
					<div class="col-lg-6">
						<input type="checkbox" data-type="checkbox" txt="" id="usessl">
					</div>
				</div>
				<div class="form-group col-lg-6">
					<label class="col-lg-4 control-label">邮箱服务器端口</label>
					<div class="col-lg-6">
						<input type="text" class="form-control input-sm" reg="notempty,port" id="eport">
					</div>
				</div>
				<div class="form-group col-lg-6" id="esslPortGroup">
					<label class="col-lg-4 control-label">邮箱服务器ssl端口</label>
					<div class="col-lg-6">
						<input type="text" class="form-control input-sm" reg="port" id="esslPort">
					</div>
				</div>
			</form>
		</div>
	</div>
</div>

<script>
	$(document).ready(function () {
		index_form_init($("#form_1"))
		var aEmaill = [{
				code: "EMAIL_HOST",
				name: "",
				parentCode: "EMAIL"
			},
			{
				code: "EMAIL_USERNAME",
				name: "",
				parentCode: "EMAIL"
			}, {
				code: "EMAIL_PASSWORD",
				name: "",
				parentCode: "EMAIL"
			}, {
				code: "EMAIL_USESSl",
				name: "",
				parentCode: "EMAIL"
			}, {
				code: "EMAIL_PORT",
				name: "",
				parentCode: "EMAIL"
			},
			{
				code: "EMAIL_TESTADDRESS",
				name: "",
				parentCode: "EMAIL"
			}
		]


		/**
		 * 
		 * @des   清除表单验证样式
		 * @param {any} form jquery对象$("#formId")
		 */
		function clearValidatorStyle(form) {
			var inputs = form.find('input')
			var selects = form.find('select')
			inputs.removeClass('input_validation-failed');
			selects.removeClass('input_validation-failed');
			inputs.removeAttr('tip');
			selects.removeAttr('tip');

		}

		/**
		 * 
		 * @desc{{ 获取填写email服务器信息}}
		 * @returns 
		 */
		function getEmailInfo() {
			aEmaill[0].name = $("#host").val()
			aEmaill[1].name = $("#username").val()
			aEmaill[2].name = $("#epass").val()
			aEmaill[3].name = $("#usessl").is(':checked') ? 1 : 0
			aEmaill[4].name = $("#eport").val()
			aEmaill[5].name = $("#testAddress").val()
		}


		/**
		 * 
		 * @desc{{ 页面初始化获取email服务器配置信息}}
		 * @returns 
		 */
		function echoEmailConf() {
			xd_ajax_get({
				url: "api/sysconf/list",
				paramObj: {
					parentCode: "EMAIL"
				},
				successCallBack: function (data) {
					echoEmailInfo=data
					setEmailConf(data)
					// data[0].name
				}
			});
		}



		/**
		 * 
		 * @desc{{ 页面初始化获取email服务器配置信息}}
		 * @returns 
		 */
		function setEmailConf(data) {
			data.forEach(function (item) {
				if (item.code == "EMAIL_HOST") {
					$("#host").val(item.name)
				} else if (item.code == "EMAIL_USERNAME") {
					$("#username").val(item.name)
				} else if (item.code == "EMAIL_PASSWORD") {
					$("#epass").val(item.name)
				} else if (item.code == "EMAIL_USESSl") {
					if (item.name == 1) {
						$("#usessl").prop("checked", 'checked')
						$("#esslPortGroup").show()
					}else{
						$("#usessl").prop("checked",false)
						$("#esslPortGroup").hide()
					}

				} else if (item.code == "EMAIL_PORT") {
					$("#eport").val(item.name)
				} else if (item.code == "EMAIL_TESTADDRESS") {
					$("#testAddress").val(item.name)
				} else if (item.code == "EMAIL_SSLPORT") {
					$("#esslPort").val(item.name)
				}


			}, this);
		}

		/**
		 * 
		 * @desc{{ 保存和测试时sslport判断}}
		 * @returns 
		 */
		function sslPort(){
			var sslPort = {
				code: "EMAIL_SSLPORT",
				name: "",
				parentCode: "EMAIL"
			}
			if ($("#usessl").is(':checked')) {
				sslPort.name = $("#esslPort").val()
				 $("#esslPort").attr("reg", "notempty,port")
				aEmaill.push(sslPort)
			}
		}
		var echoEmailInfo
		echoEmailConf()
		$("#emailSave").click(function () {
			getEmailInfo()
			 sslPort()
			$("#testAddress").attr("reg", "email")
			if (validateForm($("#form_1"))) {
				xd_ajax_post({
					url: "api/sysconf/save",
					paramObj: aEmaill,
					successCallBack: function (data) {
						echoEmailConf()
						g_dialog.operateAlert(null, "操作成功！");
					}
				});
			}
		})



		$("#usessl").change(function(){
			$("#esslPort").removeClass("input_validation-failed")
			$("#esslPort").removeAttr('tip')
			var ss=$("#usessl").is(':checked')
			if ($("#usessl").is(':checked')) {
				 $("#esslPort").attr("reg", "notempty,port")
				 $("#esslPortGroup").show()
			}else{
				$("#esslPortGroup").hide()
				$("#esslPort").attr("reg", "port")
			}
		})
		$("#reset").click(function () {
			clearValidatorStyle($("#form_1"))
			setEmailConf(echoEmailInfo)
		})
		$("#emailTest").click(function () {
			getEmailInfo()
			sslPort()
			$("#testAddress").attr("reg", "notempty,email")
			if (validateForm($("#form_1"))) {

				xd_ajax_post({
					url: "api/email/test",
					paramObj: aEmaill,
					successCallBack: function (data) {

						g_dialog.operateAlert(null, "操作成功！");
					}
				});
			}
		})
	})
</script>